<template>
  <el-dialog
    v-model="modalForm.visible"
    title="title"
    @close="onClose">
    <el-form
      ref="modelRef"
      :model="modalForm.params"
      :rules="modalForm.rules"
      :label-width="'160px'">
      <el-form-item label="订单ID">
        <el-input v-model="modalForm.params.order_id" placeholder="请输入" readonly />
      </el-form-item>
      <el-form-item label="是否显示">
        <el-radio-group v-model="modalForm.params.status">
          <el-radio :label="301">拒绝</el-radio>
          <el-radio :label="201">通过</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item label="备注">
        <el-input v-model="modalForm.params.remark" type="textarea" placeholder="请输入" />
      </el-form-item>
    </el-form>
    <template #footer>
      <span class="dialog-footer">
        <el-button @click="onClose">取消</el-button>
        <el-button type="primary" @click="modalForm.submit">确定</el-button>
      </span>
    </template>
  </el-dialog>
</template>

<script setup>
const props = defineProps({
  modelValue: false,
  info: {
    type: Object,
    default: () => {}
  }
})
const emit = defineEmits([
  'update:modelValue',
  'confirm'
])
const onClose = () => emit('update:modelValue', false)
const modalRef = ref(null)
const modalForm = reactive({
  visible: false,
  params: {
    order_id: '', // 订单ID
    status: '', // 审核状态：301申请不通过，201申请通过
    remark: '', // 备注
  },
  rules: {
    // title: [ { required: true, message: '请输入', trigger: 'blur' },]
  },
  submit: async () => {
    const { value: formEl } = modalRef
    if (!formEl) return
    await formEl.validate(async (valid, fields) => {
      if (valid) {
        const params = Object.assign({}, modalForm.params)
        // const { order_id, status, remark } = params
        // console.log('params', params)
        // const { status: code, message, data } = await rechargeAudit({ order_id, status, remark })
        // if (code === 200) {
        //   proxy.$modal.msgSuccess(message)
        //   modalForm.visible = false
        //   record.refresh()
        // }
      }
    })
  }
})

watch(() => props.modelValue, (newValue) => {
  modalForm.visible = newValue
}, { immediate: true })
watch(() => props.info, (newValue) => {
  modalForm.params.order_id = newValue.id
})
</script>

<style>

</style>